From 9b7ee1bbde03bd07790599bc6862632dc8e3a4f8 Mon Sep 17 00:00:00 2001 From: Paul Donald Date: Wed, 23 Apr 2025 14:03:57 +0200 Subject: [PATCH] luci-theme: fix some dynamic layout issues Implement a dynamic menu item width to allow item unwrapped and visible: 'min-width: max-content;' or 'max-width: max-content;' Remove IE hacks and fix a console error for -webkit-scrollbar-thumb Signed-off-by: Paul Donald (cherry picked from commit 91572540595dae9ea88ae5e38ce01847cb4c08e0) --- .../htdocs/luci-static/bootstrap/cascade.css | 3 +-- .../htdocs/luci-static/material/cascade.css | 11 ++++------- .../htdocs/luci-static/openwrt2020/cascade.css | 4 ++-- .../htdocs/luci-static/openwrt.org/cascade.css | 2 +- 4 files changed, 8 insertions(+), 12 deletions(-) diff --git a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css index 003f4507c2..c4a6c8a754 100644 --- a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css +++ b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css @@ -1130,8 +1130,7 @@ a.menu:after { top: 40px; left: -9999px; z-index: 900; - min-width: 160px; - max-width: 220px; + min-width: max-content; margin-left: 0; margin-right: 0; padding: 6px 0; diff --git a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css index 0e47c66129..d567876250 100644 --- a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css +++ b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css @@ -345,6 +345,7 @@ small { float: left; overflow-x: auto; width: calc(0% + 15rem); + min-width: max-content; height: calc(100% - 4rem); background-color: var(--white-color); transition: visibility 400ms, width 400ms; @@ -2511,7 +2512,7 @@ input[name="nslookup"] { } /* IE hacks */ -@media all and (-ms-high-contrast: none) { +@media all { .main > .main-left > .nav > .slide > .menu::before { top: 30.25%; } @@ -2519,10 +2520,6 @@ input[name="nslookup"] { .main > .main-left > .nav > li:last-child::before { top: 20%; } - - .showSide::before { - top: -12px; - } } @media screen and (max-width: 1600px) { @@ -3104,12 +3101,12 @@ input[name="nslookup"] { ::-webkit-scrollbar-thumb { background: #9e9e9e; } - +/* ::-webkit-scrollbar-thumb:hover { background: #757575; } ::-webkit-scrollbar-thumb:active { background: #424242; - } + }*/ } diff --git a/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css b/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css index 3de1ebeb9b..d4b5e82a4f 100644 --- a/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css +++ b/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css @@ -156,8 +156,8 @@ abbr[title], acronym[title] { } #mainmenu { - flex: 1 1 100px; - max-width: 250px; +/* flex: 1 1 100px;*/ + max-width: max-content; background: var(--main-dark-color); color: var(--main-bright-color); padding: 1em; diff --git a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css index fbb53f9e99..86043611f7 100644 --- a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css +++ b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css @@ -82,7 +82,7 @@ a img { } #mainmenu { - max-width: 200px; + max-width: max-content; background: #f5f5f5; border: 1px solid #444; border-width: 0 0 1px 1px; -- 2.30.2